<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<script type="text/javascript">
    require([ "dojo/_base/array", "dojo/_base/xhr", "dojo/request", "dojo/topic", "dojo/json", "dojo/_base/lang",
            "dojo/dom", "dijit/Dialog" ], function(array, xhr, request, topic, JSON, lang, dom, Dialog) {
        var deletItemsCount = 0;
        carRestForm = function(formId) {
            dijit.byId(formId).reset();
            document.getElementById("carbuyinsuretime").value = "";
            document.getElementById("caraudittime").value = "";
            document.getElementById("carbuydate").value = "";
            document.getElementById("carbuyinsuretimeu").value = "";
            document.getElementById("caraudittimeu").value = "";
            document.getElementById("carbuydateu").value = "";
            if (formId.indexOf('UFD') != -1) {
                var rowid = jQuery("#carGird").jqGrid('getGridParam', 'selrow');
                var car = jQuery("#carGird").jqGrid('getRowData', rowid);
                dijit.byId('carUFD').setValues(car);
            }
        };
        topic.subscribe("car/insertOrUpdate", carRestForm);
        var syncDB = function(url, jsonData) {
            request.post(url, {
                data : jsonData,
                headers : {
                    'Content-Type' : "application/json; charset=utf-8"
                },
                timeout : 30000
            }).then(function(response) {
                topic.publish("notifyMsgTopic", {
                    message : response,
                    type : "message",
                    duration : 1000
                });
                var currentPage = jQuery('#carGird').jqGrid('getGridParam', 'page');
                var pageSize = jQuery('#carGird').jqGrid('getGridParam', 'rowNum');
                var totalCount = jQuery('#carGird').jqGrid('getGridParam', 'records') - deletItemsCount;
                var totalPages = Math.ceil(totalCount / pageSize);
                jQuery("#carGird").jqGrid('setGridParam', {
                    page : currentPage > totalPages ? totalPages : currentPage
                }).trigger("reloadGrid");
            }, function(error) {
                alert(error);
            });
        };
        carSubmitForm = function(formId, type) {
            var url = "car/insert";
            if (type == 'u') {
                url = "car/update";
            }
            var form = dijit.byId(formId);
            if (form.isValid()) {
                var json = dojo.toJson(form.getValues(), true);
                syncDB(url, json);
                form.hide();
                topic.publish("car/insertOrUpdate", formId);
            } else {
                form.validate();
            }
        };
        carDelete = function() {
            var ids = jQuery("#carGird").jqGrid('getGridParam', 'selarrrow') || [];
            deletItemsCount = ids.length;
            if (ids.length > 0) {
                if (confirm('确认删除所选定的项？')) {
                    var car = {};
                    car.id = '';
                    array.forEach(ids, function(entry, i) {
                        car.id += entry + ",";
                    });
                    syncDB("car/delete", dojo.toJson(car, true));
                }
            } else {
                alert('请选择至少一条数据!');
            }
        };
        carQuery = function(formId) {
            var car = dijit.byId(formId).getValues();
            jQuery("#carGird").jqGrid('setGridParam', {
                postData : car,
                mtype : "post"
            }).trigger('reloadGrid');
        };
        showDetails = function(id) {
            jQuery("#carGird").jqGrid('setSelection',id);
            var car = jQuery("#carGird").jqGrid('getRowData', id);
            dijit.byId('carUFD').setValues(car);
            if(car['cartimage'] && car['cartimage'] != "") {
              dom.byId('uploadFilesUU').src = 'attachment/preview?fileid=' + car['cartimage'];
            }
            dijit.byId('carUFD').show();
        };
    });
</script>
<div data-dojo-type="dijit/Dialog" id="carIFD" title="新增">
  <div class="dijitDialogPaneContentArea">
    <table>
      <tr>
        <td><label for="carno">车牌号: </label></td>
        <td><input data-dojo-type="dijit/form/ValidationTextBox" data-dojo-props="required: true" type="text" name="carno"></td>
      </tr>
      <tr>
        <td><label for="cartype">车型类别: </label></td>
        <td><select data-dojo-type="dijit/form/ComboBox" name="cartype">
            <option>轿车</option>
            <option>货车</option>
            <option>商务车</option>
        </select></td>
      </tr>
      <tr>
        <td><label for="engineno">发动机型号: </label></td>
        <td><input data-dojo-type="dijit/form/ValidationTextBox" type="text" name="engineno"></td>
      </tr>
      <tr>
        <td><label for="buyinsuretime">购买保险时间: </label></td>
        <td><input data-dojo-type="dijit/form/ValidationTextBox" type="text" id="carbuyinsuretime" class="Wdate" name="buyinsuretime" onClick="WdatePicker()"></td>
      </tr>
      <tr>
        <td><label for="audittime">年审时间: </label></td>
        <td><input data-dojo-type="dijit/form/ValidationTextBox" type="text" id="caraudittime" name="audittime" class="Wdate" onClick="WdatePicker()"></td>
      </tr>
      <tr>
        <td><label for="factorymodel">厂牌型号: </label></td>
        <td><input data-dojo-type="dijit/form/ValidationTextBox" data-dojo-props="required: true" type="text" name="factorymodel"></td>
      </tr>
      <tr>
        <td><label for="driver">驾驶员: </label></td>
        <td><input data-dojo-type="dijit/form/ValidationTextBox" data-dojo-props="required: true" type="text" name="driver"></td>
      </tr>
      <tr>
        <td><label for="buydate">购置日期: </label></td>
        <td><input data-dojo-type="dijit/form/ValidationTextBox" data-dojo-props="required: true" type="text" id="carbuydate" name="buydate" class="Wdate" onClick="WdatePicker()"></td>
      </tr>
      <tr>
        <td><label for="status">当前状态: </label></td>
        <td><select data-dojo-type="dijit/form/Select" name="status" style="width: 100px;">
            <option value="1">可用</option>
            <option value="2">维修中</option>
            <option value="0">报废</option>
        </select></td>
      </tr>
      <tr>
        <td><label for="cartimage">车辆图片: </label></td>
        <td><input id="uploadFilesII" data-dojo-type="dijit/form/TextBox" data-dojo-props="readonly : true" onclick="uploadComponet(this,'fileIdII');" /> <input id="fileIdII"
          data-dojo-type="dijit/form/TextBox" name="cartimage" style="display: none;"></td>
      </tr>
      <tr>
        <td><label for="notes">备注: </label></td>
        <td><input data-dojo-type="dijit/form/ValidationTextBox" type="text" name="notes"></td>
      </tr>
    </table>
  </div>
  <div class="dijitDialogPaneActionBar">
    <button data-dojo-type="dijit/form/Button" type="button" onclick="carSubmitForm('carIFD','i')">保存</button>
    <button data-dojo-type="dijit/form/Button" type="button" onclick="carRestForm('carIFD');">重置</button>
  </div>
</div>
<div data-dojo-type="dijit/Dialog" id="carUFD" title="更新">
  <div class="dijitDialogPaneContentArea">
    <input data-dojo-type="dijit/form/ValidationTextBox" data-dojo-props="required: true, readOnly: true" type="text" name="carid" style="display: none;">
    <table>
      <tr>
        <td><label for="carno">车牌号: </label></td>
        <td><input data-dojo-type="dijit/form/ValidationTextBox" data-dojo-props="required: true" type="text" name="carno"></td>
      </tr>
      <tr>
        <td><label for="cartype">车型类别: </label></td>
        <td><select data-dojo-type="dijit/form/ComboBox" name="cartype">
            <option value="轿车">轿车</option>
            <option value="货车">货车</option>
            <option value="商务车">商务车</option>
        </select></td>
      </tr>
      <tr>
        <td><label for="engineno">发动机型号: </label></td>
        <td><input data-dojo-type="dijit/form/ValidationTextBox" type="text" name="engineno"></td>
      </tr>
      <tr>
        <td><label for="buyinsuretime">购买保险时间: </label></td>
        <td><input data-dojo-type="dijit/form/ValidationTextBox" type="text" id="carbuyinsuretimeu" name="buyinsuretime" class="Wdate" onClick="WdatePicker()"></td>
      </tr>
      <tr>
        <td><label for="audittime">年审时间: </label></td>
        <td><input data-dojo-type="dijit/form/ValidationTextBox" type="text" id="caraudittimeu" name="audittime" class="Wdate" onClick="WdatePicker()"></td>
      </tr>
      <tr>
        <td><label for="factorymodel">厂牌型号: </label></td>
        <td><input data-dojo-type="dijit/form/ValidationTextBox" data-dojo-props="required: true" type="text" name="factorymodel"></td>
      </tr>
      <tr>
        <td><label for="driver">驾驶员: </label></td>
        <td><input data-dojo-type="dijit/form/ValidationTextBox" data-dojo-props="required: true" type="text" name="driver"></td>
      </tr>
      <tr>
        <td><label for="buydate">购置日期: </label></td>
        <td><input data-dojo-type="dijit/form/ValidationTextBox" data-dojo-props="required: true" type="text" id="carbuydateu" name="buydate" class="Wdate" onClick="WdatePicker()"></td>
      </tr>
      <tr>
        <td><label for="status">当前状态: </label></td>
        <td><select data-dojo-type="dijit/form/FilteringSelect" name="status" style="width: 100px;">
            <option value="1">可用</option>
            <option value="2">维修中</option>
            <option value="0">报废</option>
        </select></td>
      </tr>
       <tr>
        <td><label for="cartimage">车辆图片: </label></td>
        <td><img id="uploadFilesUU" src='' onclick="uploadComponet(this,'fileIdUU');" /> 
            <input id="fileIdUU" data-dojo-type="dijit/form/TextBox" name="cartimage" style="display: none;"></td>
      </tr> 
      <tr>
        <td><label for="notes">备注: </label></td>
        <td><input data-dojo-type="dijit/form/ValidationTextBox" type="text" name="notes"></td>
      </tr>
    </table>
  </div>
  <div class="dijitDialogPaneActionBar">
    <button data-dojo-type="dijit/form/Button" type="button" onclick="carSubmitForm('carUFD','u')">保存</button>
    <button data-dojo-type="dijit/form/Button" type="button" onclick="carRestForm('carUFD');">重置</button>
  </div>
</div>
<fieldset>
  <legend>&nbsp;&nbsp;信息选项&nbsp;&nbsp;</legend>
  <form id="queryCarForm" data-dojo-type="dijit/form/Form" method="post">
    <div style="margin-left: 5px;">
      <table cellspacing="10">
        <tr>
          <td><label for="carno">车牌号: </label></td>
          <td><input data-dojo-type="dijit/form/ValidationTextBox" type="text" name="carno"></td>
          <td><label for="cartype">车型类别: </label></td>
          <td><select data-dojo-type="dijit/form/ComboBox" name="cartype">
              <option>&nbsp;</option>
              <option>轿车</option>
              <option>货车</option>
              <option>商务车</option>
          </select></td>
          <td><label for="status">当前状态: </label></td>
          <td><select data-dojo-type="dijit/form/FilteringSelect" name="status" style="width: 100px;">
              <option value="3">全部</option>
              <option value="1">可用</option>
              <option value="2">维修中</option>
              <option value="0">报废</option>
          </select></td>
        </tr>
      </table>
    </div>
  </form>
  <div style="padding: 5px;">
    <button id="carInsertBtn" data-dojo-type="dijit/form/Button" type="submit" label="新增">
      <script type="dojo/method" event="onClick" args="evt">
        dijit.byId('carIFD').show();
      </script>
    </button>
    <button id="carDeleteBtn" data-dojo-type="dijit/form/Button" type="button" label="删除" onclick="carDelete();"></button>
    <button id="carQueryBtn" data-dojo-type="dijit/form/Button" type="button" label="查询" onclick="carQuery('queryCarForm');"></button>
  </div>
</fieldset>
<div id="gird">
  <table id="carGird"></table>
  <div id="carToolbar"></div>
</div>
<script type="text/javascript">
    jQuery("#carGird").jqGrid(
            {
                url : 'car/queryAsList',
                datatype : "json",
                autowidth : true,
                rownumbers : true,
                height : 'auto',
                colNames : [ '车辆ID', '车牌号', '轿车、货车、商务车', '发动机型号', '购买保险时间', '年审时间', '备注', '厂牌型号', '驾驶员', '购置日期', '状态',
                        '当前状态', '车辆图片', '管理' ],
                colModel : [ {
                    name : 'carid',
                    index : 'carid',
                    width : 60,
                    key : true,
                    hidden : true,
                    align : 'center'
                }, {
                    name : 'carno',
                    index : 'carno',
                    width : 180,
                    align : 'center'
                }, {
                    name : 'cartype',
                    index : 'cartype',
                    hidden : true
                }, {
                    name : 'engineno',
                    index : 'engineno',
                    hidden : true
                }, {
                    name : 'buyinsuretime',
                    index : 'buyinsuretime',
                    width : 120,
                    align : 'center'
                }, {
                    name : 'audittime',
                    index : 'audittime',
                    hidden : true
                }, {
                    name : 'notes',
                    index : 'notes',
                    hidden : true
                }, {
                    name : 'factorymodel',
                    index : 'factorymodel',
                    hidden : true
                }, {
                    name : 'driver',
                    index : 'driver',
                    width : 120,
                    align : 'center'
                }, {
                    name : 'buydate',
                    index : 'buydate',
                    width : 120,
                    align : 'center'
                }, {
                    name : 'status',
                    index : 'status',
                    hidden : true
                }, {
                    name : 'statusName',
                    index : 'statusName',
                    width : 120,
                    align : 'center'
                }, {
                    name : 'cartimage',
                    index : 'cartimage',
                    hidden : true
                }, {
                    width : 120,
                    name : 'manager',
                    index : 'manager',
                    align : 'center'
                } ],
                rowNum : 15,
                rowList : [ 15, 20, 25, 30 ],
                pager : '#carToolbar',
                recordpos : 'right',
                viewrecords : true,
                sortorder : "desc",
                jsonReader : {
                    repeatitems : false
                },
                gridComplete : function() {
                    var ids = jQuery("#carGird").jqGrid('getDataIDs');
                    for ( var i = 0; i < ids.length; i++) {
                        var cl = ids[i];
                        var manager = "";
                        var carcheck = jQuery("#carGird").jqGrid('getRowData', cl);
                        var status = carcheck['status'] == '1' ? '可用' : (carcheck['status'] == '2' ? '维修中' : '报废');
                        manager = "<a style='width:40px;' href='javascript:void(0);' onclick=\"showDetails('" + cl
                                + "');\">编辑</a>";
                        jQuery("#carGird").jqGrid('setRowData', cl, {
                            statusName : status,
                            manager : manager
                        });
                    }
                },
                multiselect : true,
                shrinkToFit : false,
                caption : "车辆管理表列表"
            });
    jQuery("#carGird").jqGrid('navGrid', '#carToolbar', {
        edit : false,
        add : false,
        del : false,
        search : false,
        refresh : true
    });
</script>
